<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>题海 - 登录</title>
  <!-- 修正CSS路径 -->
  <link th:href="@{/css/backgroundAnimation.css}" rel="stylesheet">
  <link href="https://fonts.googleapis.com/css2?family=Pacifico&display=swap" rel="stylesheet">
  <script src="https://cdn.jsdelivr.net/npm/axios/dist/axios.min.js"></script>
</head>
<body>
<!-- 背景方块 -->
<ul class="bg-squares">
  <li></li>
  <li></li>
  <li></li>
  <li></li>
  <li></li>
  <li></li>
  <li></li>
  <li></li>
  <li></li>
  <li></li>
</ul>

<!-- 登录表单 -->
<div class="container">
  <h2>欢迎来到<b class="art-text">题海</b></h2>

  <div id="error-message" class="error-message" style="display: none;"></div>

  <form th:action="@{/login}" method="post">
    <div th:if="${error}" class="alert alert-danger" th:text="${error}"></div>
    <div class="form">
      <input type="text" id="account" name="account" placeholder="账号/手机号" required>
      <input type="password" id="password" name="password" placeholder="密码" required>
      <div class="form-actions">
        <!-- 修正注册链接 -->
        <a th:href="@{/register}" class="btn-login">注册</a>
        <button type="submit" class="btn-login">登录</button>
      </div>
    </div>
  </form>
</div>
</body>
</html>